@extends('home.layout.base')
<link rel="stylesheet" href="{{URL::asset('./css/hrmy/address.css')}}">

@section('content')
<div class="mainHrContent" id="hrAddr">
    <div class="storelistTitle">
        <span class="storelistTitle_left">
            <span>
                <img src="{{URL::asset('./img/icon/home.png')}}">
            </span>
            <span><a href="{{route('home.index.index') }}">首页</a> >
                <a href="{{route('home.hrmy.hrIndex') }}">用户中心</a>
                > 收货地址
            </span>
        </span>
        <span class="storelistTitle_right">
            <span>找不到合适的供应商？发个需求试试？</span>
            <button @click=" window.location.href = '{{ route('home.demand.demandAdd') }}'">免费发布需求</button>
        </span>
    </div>
    <div class="hrContent">
        @include('home.hrmy.menu')
        <div class="basicInfo" id="hrAddrs">
            <div class="basicInfo_title">
                <span></span>
                收货地址
                <button v-if="hrAddress.length==0"><a href="{{route('home.hrmy.hrAddressAdd') }}">新增</a></button>
            </div>
            <div class="tableAddr">
                <table>
                    <thead>
                        <tr>
                            <th>收货人</th>
                            <th>所在地区</th>
                            <th>详细地址</th>
                            <th>联系电话</th>
                            <th>操作</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr v-for="(item,index) in hrAddress">
                            <td>@{{item.realname}}</td>
                            <td>@{{item.area}}</td>
                            <td>@{{item.detail}}</td>
                            <td>@{{item.phone}}</td>
                            <td>
                                <a :href="'{{route('home.hrmy.hrAddressAdd') }}?addrId='+item.id">编辑</a>
                                <i></i>
                                <a @click="deleteAddr(item.id)">删除</a>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
@endsection
@section('compontentScipts')
<script>
    $(() => {
        let hrAddr = new Vue({
            el: '#hrAddrs',
            data: () => {
                return {
                    hrAddress: [],
                }
            },
            created() {
                this.getList();
            },
            mounted() {},
            methods: {
                getList() {
                    let data = {
                        
                    };
                    apiAjax("{{ route('home.user.hrAddressApi')}}", 'get', data, (res) => {
                        if (res.code == 0) {
                            this.hrAddress = res.data
                        } else {
                            this.$message({
                                message: res.msg,
                                type: 'warning'
                            });
                        }
                    }, (erro) => {

                    });
                },
                deleteAddr(id) {
                    let data = {
                        address_id: id
                    };
                    apiAjax("{{ route('home.user.hrAddressDeleteApi')}}", 'post', data, (res) => {
                        if (res.code == 0) {
                            this.$message({
                                message: res.msg,
                                type: 'success'
                            });
                            this.getList();
                        } else {
                            this.$message({
                                message: res.msg,
                                type: 'warning'
                            });
                        }
                    }, (erro) => {

                    });
                }
            }
        })
    })
</script>
@endsection